<template>
    <div class="user-nav">
        <a-dropdown trigger="hover" style="padding-right: 36px;">
            <a-avatar :size="32"></a-avatar>
            <template #content>
                <a-dgroup>
                    <a-doption v-if="nowModule !== 'home'" @click="router.push('/home')">
                        <icon-home /> 主页
                    </a-doption>
                    <a-doption v-if="nowModule !== 'console'" @click="router.push('/console')">
                        <icon-dashboard /> 控制台
                    </a-doption>
                    <!-- <a-doption v-if="nowModule !== 'mine'" @click="router.push('/mine')">
                        <icon-user /> 个人中心
                    </a-doption>
                    <a-doption v-if="nowModule !== 'configures'" @click="router.push('/configures')">
                        <icon-settings /> 配置中心
                    </a-doption> -->
                </a-dgroup>
                <a-dgroup>
                    <a-doption v-if="userStore.isLogin" @click="userStore.logout()">
                        <a-space>
                            <icon-export /> 退出登录
                        </a-space>
                    </a-doption>
                </a-dgroup>
            </template>
        </a-dropdown>
    </div>
</template>
<script lang="ts" setup>

const router = useRouter()
const userStore = useUserStore()
const props = withDefaults(defineProps<{ nowModule: string }>(), {

})

const { nowModule } = props

</script>
<style scoped lang="css">
.user-nav {
    overflow: auto;
    scrollbar-width: none;
    /* 针对Firefox */
}

.user-nav::-webkit-scrollbar {
    display: none;
    /* 针对Chrome, Safari, Edge */
}
</style>